<template>
  <div class="pagebody">
    <StickHead></StickHead>
    <div class="headtop pos-rel bgfff text-al-center fz30">
      企业列表
      <div class="pos-abs fz48 fwbold add" @click="toadd()">
        <van-icon name="add-o" color="#1989fa" size="0.4rem" />
      </div>
    </div>
    <div class="thingbox borderbox">
      <div class="search align-center borderbox br20 bgfff flex-row">
        <img src="@/static/img/search.png"  alt="" />
        <input
          type="text"
          v-model="searchQuery"
          @keyup.enter="search"
          placeholder="搜索企业名称"
          class="fz24 ml20 searchinput"
        />
      </div>
      <ul class="informationlist mt25">
        <li
          v-for="(item) in infolist"
          :key="item.id"
          @click="toinfoDetail(item.id)"
          class="borderbox br20 mb16 bgfff justify-between flex-row align-center"
        >
          <span class="fz24">{{item.enterpriseName}}</span>
          <img src="@/static/img/breadright.png" alt="" />
        </li>
      </ul>
    </div>
    <div
      class="fz24 bgF4 color909399 align-center justify-center"
      style="height: 0.88rem"
    >
      没有更多数据了
    </div>

    <StickFoot :type="'myself'"></StickFoot>
  </div>
</template>

<script>
import StickHead from "@/layout/StickHead.vue";
import StickFoot from "@/layout/StickFoot.vue";
import { getenterpriseList } from "@/api/api";
import { debounce } from "lodash";
export default {
  name: "information",
  components: {
    StickHead,
    StickFoot,
  },
  data() {
    return {
      searchQuery: "",
      infolist: [],
      contactPhone:""
    };
  },
  watch: {
    searchQuery() {
      // 当 searchQuery 改变时，调用防抖函数进行搜索
      this.debouncedSearch();
    },
  },
  mounted() {
    this.userinfo = JSON.parse(window.localStorage.getItem("userinfo"));
    console.log("this.userinfo",this.userinfo)
    if(this.userinfo.roles.includes("qy")){
      console.log("11111")
      this.contactPhone = this.userinfo.phonenumber
    }
    this.getinfolist();
    this.debouncedSearch = debounce(this.search, 1000);
  },
  methods: {
    toadd() {
      this.$router.push({ name: "addinformation" });
    },
    toinfoDetail(id) {
      this.$router.push({ name: "editinformation", params: { id: id } });
    },
    getinfolist() {
      let phonenumber = JSON.parse(window.localStorage.getItem("userinfo")).phonenumber;
      let getentdata = {
        contactPhone: this.contactPhone,
      };
      getenterpriseList(getentdata).then((response) => {
        this.infolist = response.data.rows;
      });
    },
    search() {
      if (this.searchQuery != "") {
        // 执行实际的搜索逻辑...
        getenterpriseList({enterpriseName: this.searchQuery}).then((response) => {
          this.infolist = response.data.rows;
        });
      } else {
        this.getinfolist()
      }
    },
  },
};
</script>

<style lang="scss" >
.pagebody {
  background-color: #f6f8fb;
  .headtop {
    line-height: 0.8rem;
    height: 0.8rem;
    .add {
      right: 0.2rem;
      top: 0;
      bottom: 0;
      margin: auto;
    }
  }
  .thingbox {
    padding: 0.24rem;
    .search {
      padding: 0 0.24rem;
      height: 0.6rem;
      img {
        width: 0.3rem;
        height: 0.3rem;
      }
      .searchinput {
        border: none;
        height: 0.5rem;
        width: -webkit-fill-available;
      }
    }
    .informationlist {
      li {
        height: 1rem;
        padding: 0.24rem;
        img {
          width: 0.16rem;
        }
      }
    }
  }
}
</style>